<template>
    <bi-tab :focus="0">
        <bi-tab-item v-for="item,key in list" :label="item.driver" :key="key">
            <bi-textarea v-model="item.content" style="height: 100px;"   ></bi-textarea>
            <div class="getSQLcode">
                <bi-select v-model="item.selectDatabase" placeholder="选择数据库" style="flex: 1;" :option="item.config"  >

                </bi-select>
                <bi-button type="info" @click="getSQLtext(item)">获取SQL</bi-button>
            </div>
        </bi-tab-item>
    </bi-tab>
</template>


<script>
export default {
    dialog:{
        title:'Create Table SQL',
        loading:true
    },
    data(){
        return {
            list:{}
        }
    },
    props:{
        app:String,
        modelName:String
    },
    methods:{
        dialogOk(){
            
            let sql = {};

            this.list.forEach(element => {
                sql[element.driver] = element.content
            });
            
            this.$ajax({
                url:this.$url({controller:'database',action:'saveCreateSQL',}),
                data:{
                    sql,
                    app:this.app,
                    modelName:this.modelName
                },
                success:(data)=>{
                    this.$toast('保存成功');
                    this.dialog.close();
                }
            });
            return false;
        },
        getSQLtext(item){

            if (!item.selectDatabase){
                this.$toast({'text':'请选择数据库','type':'warning'});
                return;
            }


            let prop = {
                app:this.app,
                modelName:this.modelName,
                database:item.selectDatabase
            }

            this.$loading();

            this.$ajax({
                url:this.$url({controller:'database',action:'getCreateSQLText'}),
                data:prop,
                success:(res)=>{
                    item.content = res.sql;
                    this.$loading(false);
                }
            });
        }
    },
    mounted(){
        this.$ajax({
            url:this.$url({controller:'database',action:'getCreateSQL'}),
            data:{
                app:this.app,
                modelName:this.modelName
            },
            success:(res)=>{
                this.list = res;
                this.dialog.loading = false;
            },fail:(msg)=>{
                this.$alert({text:msg,type:'error'});
                this.dialog.close();
            }
        })
    }
}
</script>


<style>
.getSQLcode{
    padding-top: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}
</style>